<template>
  <div class="w-[100vw] h-[100vh] flex">
    <SideBar v-model="currentSideBarIndex" />
    <div class="container"><ThreeWater /></div>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import SideBar from "@/components/SideBar.vue";
import ThreeWater from "@/components/ThreeWater.vue";

const currentSideBarIndex = ref(0);
</script>

<style scoped>
.container {
  flex: 1;
  height: 100%;
}
</style>
